<template>
  <div>
    <!-- 商家列表 shop-->
    <!-- v-if/v-else通过传递地址是否带参数还判断显示哪一个标题 -->
    <!-- <h2>待审核商家</h2> -->
    <h2>商家列表</h2>
    <el-table border :data="tableData">
      <el-table-column prop="sid" label="编号" width="80"></el-table-column>
      <el-table-column prop="s_user" label="账户名" width="120"></el-table-column>
      <el-table-column prop="s_name" label="姓名" width="80"></el-table-column>
      <el-table-column prop="s_phone" label="电话" width="120"></el-table-column>
      <el-table-column prop="shop_name" label="店铺名称" width="180"></el-table-column>
      <el-table-column prop="s_quality" label="资质"></el-table-column>
      <!-- 0:审核未通过  1:审核通过 2:待审核 9:禁用-->
      <el-table-column prop="state" label="状态" width="140">
        <template slot-scope="scope">
          <span v-if="scope.row.state==0"><el-alert title="审核通过" type="success" show-icon :closable="false"></el-alert></span>
          <span v-if="scope.row.state==1">待审核</span>
          <span v-if="scope.row.state==9"><el-alert title="禁用" type="error" show-icon :closable="false"></el-alert></span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center">
        <el-button type="primary">详情</el-button>
        <el-button type="success">通过</el-button>
        <el-button type="danger">禁用</el-button>
      </el-table-column>
      
    </el-table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableData: [
        {sid: '1001', s_user: 'ss1', s_name: '小新',s_email: 'xin11@qq.com', s_phone: '15012312312', shop_name: '喵爸喵妈', s_quality: 'xxxx', state: 1},
        {sid: '1002', s_user: 'ss1', s_name: '明',s_email: 'ming11@qq.com', s_phone: '15012312312', shop_name: '999', s_quality: 'xxxx', state: 0},
        {sid: '1003', s_user: 'ss1', s_name: '姓名',s_email: 'xin11@qq.com', s_phone: '15012312312', shop_name: '我就不写名', s_quality: 'xxxx', state: 9}
      ]
    }
  },
}
</script>